#relationBox{ width:100%; height:100%; position:absolute; left:0; top:0; z-index:9;}

.handlebox{ position:absolute; bottom:10px; right:10px; z-index:9999; width:160px; height:60px; border:2px solid #666; border-radius:10px; background-color:#FFF;}
.handlebox span.up,.handlebox span.down,.handlebox span.left,.handlebox span.right,.handlebox span.hand,.handlebox span.narrow,.handlebox span.enlarge,.handlebox span.adapt{ position:absolute; display:inline-block; width:20px; height:20px; background:url(../images/handle-ico.png) no-repeat;}
.handlebox span.selected,.handlebox span:hover{ background:url(../images/handle-cur-ico.png) no-repeat;}
.handlebox span.up,.handlebox span.up:hover{ top:0; left:20px; background-position:0 5px;}
.handlebox span.down,.handlebox span.down:hover{ bottom:0; left:20px; background-position:0 5px; transform:rotate(180deg);}
.handlebox span.left,.handlebox span.left:hover{ top:20px; left:0; background-position:0 5px; transform:rotate(270deg);}
.handlebox span.right,.handlebox span.right:hover{ top:20px; left:40px; background-position:0 5px; transform:rotate(90deg);}
.handlebox span.hand,.handlebox span.hand:hover{ top:20px; left:20px; background-position:0 -20px;}
.handlebox span.narrow,.handlebox span.narrow:hover{ top:20px; left:70px; background-position:0 -40px;}
.handlebox span.enlarge,.handlebox span.enlarge:hover{ top:20px; left:130px; background-position:0 -60px;}
.handlebox span.adapt,.handlebox span.adapt:hover{ top:20px; left:100px; background-position:0 -80px;}

.essentialInfo{ padding:5px 10px; background-color:#000; border-radius:3px; opacity:0.5;}
.essentialInfo li{ font:400 12px/24px 'Microsoft Yahei'; color:#FFF;}

/*2018-08-04*/
.editproperties{ float:left; width:100%; margin-top:10px;}
.editproperties .tabs{ float:left; width:165px; padding-right:10px; margin-left:10px;}
.editproperties .tabs li{ font:400 14px/30px 'Microsoft Yahei'; cursor:pointer;}
.editproperties .tabs li .chkcobj{ margin-right:5px; vertical-align:middle;}
.editproperties .properties{ float:left; width:300px; padding-left:10px; border-left:1px solid #eee;}
.editproperties .tabs.clearfix:after,.editproperties .properties.clearfix:after{ content:"."; display:block; height:0; clear:both; visibility:hidden;}
.editproperties .properties .list dl{ float:left; margin:5px 0;}
.editproperties .properties .list dl dt{ float:left; width:80px; padding:5px 0; text-align:right;}
.editproperties .properties .list dl dd{ float:left; width:220px; text-align:left;}
.editproperties .properties .list dl dd input{ width:190px; padding:6px; border:solid 1px #d6dde7; border-top-color:#a5a9b8;}

/*滚动条*/
.scrollbar{position:relative; max-height:105px; overflow:hidden;}

/*缩略图*/
.cytoscape-navigator{
	position:absolute;
	border: 1px solid #eee;
	background: #fff;
	z-index: 99999;
	width: 150px;
	height: 150px;
	bottom: 0;
	right: 0;
	overflow: hidden;
}

.cytoscape-navigator > img{
	max-width: 100%;
	max-height: 100%;
}

.cytoscape-navigator > canvas{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 101;
}

.cytoscape-navigatorView{
	position: absolute;
	top: 0;
	left: 0;
	cursor: move;
	background: #B7E1ED;
	-moz-opacity: 0.50;
	opacity: 0.50;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=50);
	z-index: 102;
}

.cytoscape-navigatorOverlay{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 103;
}

/* 放大缩小 */
.cy-panzoom {
	position: absolute;
	font-size: 12px;
	color: #fff;
	font-family: arial, helvetica, sans-serif;
	line-height: 1;
	color: #666;
	font-size: 11px;
	z-index: 99999;
	box-sizing: content-box;
}

.cy-panzoom-zoom-button {
	cursor: pointer;
	padding: 3px;
	text-align: center;
	position: absolute;
	border-radius: 3px;
	width: 10px;
	height: 10px;
	left: 16px;
	background: #fff;
	border: 1px solid #999;
	margin-left: -1px;
	margin-top: -1px;
	z-index: 1;
	box-sizing: content-box;
}

.cy-panzoom-zoom-button:active,
.cy-panzoom-slider-handle:active,
.cy-panzoom-slider-handle.active {
	background: #ddd;
	box-sizing: content-box;
}

.cy-panzoom-pan-button {
	position: absolute;
	z-index: 1;
	height: 16px;
	width: 16px;
	box-sizing: content-box;
}

.cy-panzoom-reset {
	top: 55px;
	box-sizing: content-box;
}

.cy-panzoom-zoom-in {
	top: 80px;
	box-sizing: content-box;
}

.cy-panzoom-zoom-out {
	top: 197px;
	box-sizing: content-box;
}

.cy-panzoom-pan-up {
	top: 0;
	left: 50%;
	margin-left: -5px;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #666;
	box-sizing: content-box;
}

.cy-panzoom-pan-down {
	bottom: 0;
	left: 50%;
	margin-left: -5px;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #666;
	box-sizing: content-box;
}

.cy-panzoom-pan-left {
	top: 50%;
	left: 0;
	margin-top: -5px;
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid #666;
	box-sizing: content-box;
}

.cy-panzoom-pan-right {
	top: 50%;
	right: 0;
	margin-top: -5px;
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid #666;
	box-sizing: content-box;
}

.cy-panzoom-pan-indicator {
	position: absolute;
	left: 0;
	top: 0;
	width: 8px;
	height: 8px;
	border-radius: 8px;
	background: #000;
	border-radius: 8px;
	margin-left: -5px;
	margin-top: -5px;
	display: none;
	z-index: 999;
	opacity: 0.6;
	box-sizing: content-box;
}

.cy-panzoom-slider {
	position: absolute;
	top: 97px;
	left: 17px;
	height: 100px;
	width: 15px;
	box-sizing: content-box;
}

.cy-panzoom-slider-background {
	position: absolute;
	top: 0;
	width: 2px;
	height: 100px;
	left: 5px;
	background: #fff;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	box-sizing: content-box;
}

.cy-panzoom-slider-handle {
	position: absolute;
	width: 16px;
	height: 8px;
	background: #fff;
	border: 1px solid #999;
	border-radius: 2px;
	margin-left: -2px;
	z-index: 999;
	line-height: 8px;
	cursor: default;
	box-sizing: content-box;
}

.cy-panzoom-slider-handle .icon {
	margin: 0 4px;
	line-height: 10px;
	box-sizing: content-box;
}

.cy-panzoom-no-zoom-tick {
	position: absolute;
	background: #666;
	border: 1px solid #fff;
	border-radius: 2px;
	margin-left: -1px;
	width: 8px;
	height: 2px;
	left: 3px;
	z-index: 1;
	margin-top: 3px;
	box-sizing: content-box;
}

.cy-panzoom-panner {
	position: absolute;
	left: 5px;
	top: 5px;
	height: 40px;
	width: 40px;
	background: #fff;
	border: 1px solid #999;
	border-radius: 40px;
	margin-left: -1px;
	box-sizing: content-box;
}

.cy-panzoom-panner-handle {
	position: absolute;
	left: 0;
	top: 0;
	outline: none;
	height: 40px;
	width: 40px;
	position: absolute;
	z-index: 999;
	box-sizing: content-box;
}

.cy-panzoom-zoom-only .cy-panzoom-slider,
.cy-panzoom-zoom-only .cy-panzoom-panner {
	display: none;
}

.cy-panzoom-zoom-only .cy-panzoom-reset {
	top: 20px;
}

.cy-panzoom-zoom-only .cy-panzoom-zoom-in {
	top: 45px;
}

.cy-panzoom-zoom-only .cy-panzoom-zoom-out {
	top: 70px;
}
.cy-panzoom span.fa{ float:left; font-size:12px;}
